<template>
  <a-modal
    :visible="visible"
    title="审核开题报告"
    :width="1600"
    :bodyStyle="{
      'max-height': '60vh',
      overflow: 'auto'
    }"
    okText="提交审核"
    @cancel="() => { $emit('cancel') }"
    @ok="confirm"
  >
    <detail-list :col="4">
      <detail-list-item term="学号">{{ rptInfo.xh }}&nbsp;</detail-list-item>
      <detail-list-item term="姓名">{{ rptInfo.xm }}&nbsp;</detail-list-item>
      <detail-list-item term="院系">{{ rptInfo.dwmc }}&nbsp;</detail-list-item>
      <detail-list-item term="专业">{{ rptInfo.zymc }}&nbsp;</detail-list-item>
      <detail-list-item term="研究方向">{{ rptInfo.yjfx }}&nbsp;</detail-list-item>
      <detail-list-item term="学生类别">{{ rptInfo.xslbmc }}&nbsp;</detail-list-item>
      <detail-list-item term="入学年月">{{ rptInfo.rxny && rptInfo.rxny.format('YYYY-MM-DD') }}&nbsp;</detail-list-item>
      <detail-list-item term="导师姓名">{{ rptInfo.dsxm }}&nbsp;</detail-list-item>
      <detail-list-item term="平均绩点">{{ rptInfo.pjjd }}&nbsp;</detail-list-item>
      <detail-list-item term="课程学习情况">已修{{ rptInfo.yxxf || 0.0 }}学分&nbsp;</detail-list-item>
      <detail-list-item term="有无重修课程">{{ rptInfo.ywcxkc }}&nbsp;</detail-list-item>
      <detail-list-item term="拟定论文题目">{{ rptInfo.ndlwtm }}&nbsp;</detail-list-item>
      <detail-list-item term="题目来源">{{ rptInfo.tmly }}&nbsp;</detail-list-item>
      <detail-list-item term="是否不宜公开">{{ rptInfo.sfsmmc }}</detail-list-item>
    </detail-list>
    <div style="margin: 10px 0;font-weight: bold;font-size: 16px;">一、选题依据及意义</div>
    <p v-html="rptInfo.xtyy && rptInfo.xtyy.replace(/\n|\r\n/g,'<br/>')"></p>
    <div style="margin: 10px 0;font-weight: bold;font-size: 16px;">二、所要解决的主要问题及研究途径与方法（预期思路与技术路线）</div>
    <p v-html="rptInfo.yqsl && rptInfo.yqsl.replace(/\n|\r\n/g,'<br/>')"></p>
    <div style="margin: 10px 0;font-weight: bold;font-size: 16px;">三、研究进度和具体时间安排</div>
    <a-table
      :columns="columns"
      :dataSource="rptInfo.yjjds"
      size="middle"
      :pagination="false"
      :scroll="{ y: 240 }"
    >
      <span slot="serial" slot-scope="text, record, index">
        {{ index + 1 }}
      </span>
      <span slot="qsrq" slot-scope="text, record">
        {{ text&&moment(text).format('YYYY.MM.DD') }}-{{ record.jsrq && moment(record.jsrq).format('YYYY.MM.DD') }}
      </span>
    </a-table>
    <template>
      <div style="margin: 10px 0;font-weight: bold;font-size: 16px;">开题报告状态:</div>
      <p>{{ rptInfo.ktbgztmc }}</p>
    </template>
    <div style="margin: 10px 0;font-weight: bold;font-size: 16px;">导师对开题的评议：</div>
    {{ rptInfo.dspy }}
    <a-form :form="form">
      <div style="margin: 10px 0;font-weight: bold;font-size: 16px;">评审专家意见：</div>
      <div class="pre-red">一、对选题依据、预期目标和技术路线的科学性、先进性及创新性的评价</div>
      <a-form-item>
        <a-textarea v-decorator="['scientificityAndAdvancementAndInnovation',
          {
            rules: [{ required: true, message: '请输入对选题依据、预期目标和技术路线的科学性、先进性及创新性的评价!' }],
          }]" :rows="8"/>
      </a-form-item>
      <div class="pre-red">二、存在的主要问题和改进措施</div>
      <a-form-item>
        <a-textarea v-decorator="['questionAndImprovementMeasure',
          {
            rules: [{ required: true, message: '请输入存在的主要问题和改进措施!' }],
          }]" :rows="8"/>
      </a-form-item>
      <div class="pre-red" style="margin: 10px 0;font-weight: bold;font-size: 16px;">三、评审专家</div>
      <a-table
        rowKey="index"
        :columns="zjcolumns"
        :dataSource="tableData"
        :pagination="false"
      >
        <template v-for="col in ['xm', 'zc','dw']" :slot="col" slot-scope="text, record">
          <a-select v-if="col == 'xm' && record.editable" :allowClear="true" showSearch :filterOption="filterOption" v-model="record[col]" @change="zjpsChange">
              <a-select-option :value="item.xm" v-for="(item,index) in  pszjList" :id="item.id" :key="index">{{item.xm}}</a-select-option>
          </a-select>
          <a-input v-else-if="record.editable && col != 'xm'" :disabled="true" :key="col" v-model="record[col]"/>
          <div v-else :key="col">{{ record[col] }}</div>
        </template>
        <template slot="action" slot-scope="text,record,index">
          <a v-if="record.editable" @click="completeAdd(record)">完成</a>
          <a v-else @click="remove(index)">删除</a>
        </template>
      </a-table>
      <a-button style="width: 100%; margin-top: 16px; margin-bottom: 8px" type="dashed" icon="plus" @click="newRow">新增行</a-button>
      <!-- <div style="margin: 10px 0;font-weight: bold;font-size: 16px;">导师审核结果</div>
      <a-form-item>
        审核结果：
        <a-select v-decorator="['dsshzt',
          {
            rules: [{ required: true, message: '请选择导师审核结果!' }],
          }]" >
          <a-select-option value="03">同意</a-select-option>
          <a-select-option value="04">不同意</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item>
        导师对开题的评议：
        <a-textarea v-decorator="['dspy',
          {
            rules: [{ required: true, message: '请输入导师对开题的评议!' }],
          }]" />
      </a-form-item> -->
      <div style="margin: 10px 0;font-weight: bold;font-size: 16px;">院系审核结果</div>

      <a-form-item
          label="审核结果"
          :labelCol="{span: 2,offset: 1}"
          :wrapperCol="{span: 5}"
      >
        <!-- <span class="pre-red">审核结果：</span> -->
        <a-select v-decorator="['yxshzt',
          {
            rules: [{ required: true, message: '请选择院系审核结果!' }],
          }]" >
          <a-select-option value="09">通过</a-select-option>
          <a-select-option value="79">建议修改或补充</a-select-option>
          <a-select-option value="08">不通过</a-select-option>
        </a-select>
      </a-form-item>
    </a-form>
  </a-modal>

</template>

<script>
import { STable } from '~'
import DetailList from '~/tool/DetailList'
import moment from 'moment'
const DetailListItem = DetailList.Item

export default {
  props: ['visible'],
  components: {DetailList, DetailListItem, STable},
  data () {
    return {
      moment,
      form: this.$form.createForm(this),
      rptInfo: {
        yjjds: []
      },
      pszjList:[],
      columns: [
        {
          title: '起讫日期',
          width: 200,
          dataIndex: 'qsrq',
          scopedSlots: { customRender: 'qsrq' }
        },
        {
          title: '主要研究内容',
          dataIndex: 'zyyjnr'
        },
        {
          title: '预期结果',
          width: 650,
          dataIndex: 'yqjg'
        }
      ],
      tableData: [],
      zjcolumns: [
        {
          title: '姓名',
          scopedSlots: { customRender: 'xm' }
        },
        {
          title: '职称',
          scopedSlots: { customRender: 'zc' }
        },
        {
          title: '所在单位、现从事专业',
          scopedSlots: { customRender: 'dw' }
        },
        {
          title: '操作',
          scopedSlots: { customRender: 'action' }
        }
      ]
    }
  },
  mounted(){
      if(this.tableData.length == 0){
        this.tableData.push({
          xm: '',
          zc: '',
          dw: '',
          action: '',
          editable: true
        })
      }
  },
  methods: {
    filterOption (value, op) {
      return op.componentOptions.children[0].text.indexOf(value) !== -1
    },
    zjpsChange(code,item){
      console.log(item)
      this.tableData[this.tableData.length - 1].zc = this.pszjList[item.key].zc
      this.tableData[this.tableData.length - 1].dw = `${this.pszjList[item.key].szdw}、${this.pszjList[item.key].xcszy}`
      this.tableData[this.tableData.length - 1].id = item.data.attrs.id
    },
    newRow () {
      let hasEdit = this.tableData.find(d => {
        return d.editable
      })
      if (hasEdit) {
        return this.$message.warning('请先完成前面的添加')
      }
      this.tableData.push({
        xm: '',
        zc: '',
        dw: '',
        action: '',
        editable: true
      })
    },
    remove (index) {
      this.tableData.splice(index, 1)
    },
    completeAdd (data) {
      if (data.xm && data.zc && data.dw) {
        return this.$set(data, 'editable', false)
      }
      this.$message.error('请输入完整的评审专家信息')
    },
    confirm () {
      this.form.validateFields((err, values) => {
        if (err) {
          return
        }
        if (!this.tableData.length) {
          return this.$message.error('评审专家不能为空')
        }
        let ids = this.tableData.map(item=>item.id)
        let params = Object.assign({
          yxshyj: values.yxshzt === '09' ? '同意' : (values.yxshzt === '08' ? '不同意' : '建议修改或补充'),
          ktbgId: this.rptInfo.id,
          // specialist: JSON.stringify(this.tableData),
          specialist: ids.join(',')
        }, values)
        this.$api.cultivate.openingCheck(params).then(res => {
          this.$message.success(res.msg)
          this.$emit('cancel')
          this.$emit('refresh')
        })
      })
    }
  }
}
</script>

<style>

</style>
